@charset "UTF-8";
/* **************************************************************************** */
// NAIYUMIE KING WANG JJANG Front End Developer <naiyumie@gmail.com>
// FileType:CRLF, Encording:UTF-8, Tab&Space:4/4, LastUpdate:2014-09-19
// ------------------------------------------------------------------------
/* **************************************************************************** */
.basicBox{
    // local variables
    $side_x:600px;
    $side_y:200px;
    $side_a:30px;
    $side_b:(($side_x)-($side_a*2));
    $side_c:(($side_y)-($side_a*2));

    background-color:transparent;box-sizing:border-box;width:$side_x;height:$side_y;position:relative;
    >span{
        display:block;position:absolute;width:$side_a;height:$side_a;box-sizing:border-box;text-indent:-999em;
        &.corner.n.e{
            background-image:none;border-top:2px solid black;border-right:2px solid black;transform: none;
        }  
        &.corner.s.w{
            background-image:none;border-bottom:2px solid black;border-left:2px solid black;transform: none;
        } 
        &.n{
            top:0px;left:50%;margin-left:(-$side_b/2);width:$side_b;background:url('d_ln_dot.png') left top repeat-x;background-color:transparent;
            &.w{top:0px;left:0px;margin-left:0px;width:$side_a;background:url('d_ln#{$side_a}.png') left top repeat-x;background-color:transparent;}
            &.e{top:0px;left:auto;right:0px;margin-left:0px;width:$side_a;transform:rotate(90deg) translateY(-$side_a);transform-origin: top left;background:url('d_ln#{$side_a}.png') left top repeat-x;background-color:transparent;}
        }
        &.s{
            bottom:0px;left:50%;margin-left:(-$side_b/2);width:$side_b;background:url('d_ln_dot.png') left bottom repeat-x;background-color:transparent;
            &.w{top:auto;bottom:0px;left:0px;margin-left:0px;width:$side_a;height:$side_a;transform: rotate(90deg) translateY(-$side_a);transform-origin:top left;background:url('d_ln#{$side_a}.png') left top repeat-x;background-color:transparent;}
            &.e{top:auto;bottom:0px;left:auto;right:0px;margin-left:0px;width:$side_a;background:url('d_ln#{$side_a}.png') left top repeat-x;background-color:transparent;}
        }
        &.ww{left:0px;bottom:auto;top:$side_a;width:$side_a;height:$side_c;background:url('d_ln_dot.png') left bottom repeat-y;background-color:transparent;}
        &.ee{right:0px;bottom:auto;top:$side_a;width:$side_a;height:$side_c;background:url('d_ln_dot.png') right bottom repeat-y;background-color:transparent;}
    }
    .text{
        display:block;width:(($side_x)-($side_a*2));height:(($side_y)-($side_a*2));padding:$side_a;font-family:dotumche;font-size:(30pt/2);
        .ln{display:inline-block;width:100%;}
    }
}